<template>
    <div class="tips_container">
        <ul class="Officespace_container_list" v-loading="loading">
            <div v-if="showimg" style="margin-top:5vh;">
                <img src="../../../assets/img/nocontent.png" alt="">
            </div>
            <li class="list_box animated fadeInUp" v-for="(item,index) in list" :key="index" >
                <router-link target="_blank" :to="{path:'/home/business/tips/tipsdetail/'+'2'+'/'+item.article_id}" class="opentag">
                <div class="list_box_img">
                    <img :src="item.head_pic" alt="文章图片" class="articleimg" v-if="item.head_pic">
                    <img src="../../../assets/img/nocontent.png" alt="" srcset="" class="nocontent" v-else>
                </div>
                <div class="list_box_name">
                    <span class="list_box_name_building">{{item.title}}</span>
                    <div style="clear:both;"></div>
                </div>
                <div class="list_box_intro">
                    <span class="intro">{{item.abstract}}</span>
                    <span class="list_box_name_date">{{item.created_time | dateFormat}}</span>
                    <span class="list_box_intro_detail">了解详情 ></span>
                    <div style="clear:both;"></div>
                </div>
                </router-link> 
            </li>
            <div style="clear:both;"></div>
        </ul>

        <!-- 分页 -->
        <div class="page_box">
            <el-pagination background :current-page="pageNum" prev-text="上一页" next-text="下一页" :page-sizes="sizelist"
            @size-change="handleSizeChange" @current-change="handleCurrentChange" layout="total, prev, pager, next, jumper" :total="total">
            </el-pagination>
        </div>
    </div>
</template>
<script>
import axios from 'axios'
import { getonearticle } from "@/api/business"
export default {
    metaInfo: {
        title: "租赁指南",
        meta: [
            {
                name: "keywords",
                content: "办公,租赁,房源,联系我们,房屋出租,办公空间出租,生意经,融资"
            },
            {
                name: "description",
                content: "房大办公生意经融资"
            }
        ]
    },
    name:'Financing',
    data() {
        return {
            list:[],
            total:1000,
            pageNum:1,
            pageSize:10,
            sizelist:[10,20,30,40],  // 每页条数
            typeId:this.$route.query.typeid,
            loading: true,
            showimg:false,
        }
    },
    created(){
        this.$root.goIndex=2
    },
    methods:{
        fetchonetype(){
            var reqParams = {
                typeId:this.typeId,
                page:this.pageNum,
                pagesize:this.pagesize,
            }
            getonearticle(reqParams).then((res)=>{
                if(res.data.code == 0){
                    this.loading = false;
                    if(res.data.data.appointment_info.length == 0){
                        this.showimg = true;
                    }
                    this.list = res.data.data.appointment_info;
                    this.total = res.data.data.all_num;
                    this.pageSize = res.data.data.now_page_num;
                }else{
                    this.$message.error(res.data.msg )
                }
            })
            .catch((error)=>{
              this.$message.error('查询找房tips列表失败!')
            })
        },
        // 切换每页条数
        handleSizeChange(val) {
            this.pageSize = val;
            this.pageNum = 1;
            this.fetchonetype();
        },
        // 跳转到第几页
        handleCurrentChange(val) {
            this.pageNum = val;
            this.fetchonetype();
        },
        
    },
    mounted () {
        this.fetchonetype();
    }
}
</script>
<style lang="scss" scoped>
@import "../../../style/common.scss";
@import "./financing.scss";
</style>
